<html>
<head>
    <meta charset="utf-8">
    <meta name="apple-touch-fullscreen" content="yes" />
    <meta name="format-detection" content="telphone=no, email=no" />
    <meta name="renderer" content="webkit" />
    <meta name="HandheldFriendly" content="true" />
    <meta name="MobileOptimized" content="480" />
    <meta name="screen-orientation" content="portrait" />
    <meta name="x5-orientation" content="portrait" />
    <title>选择计划</title>
    <style type="text/css">
        .label_box>label {
            display:block;
            float:left;
            margin:0 8px 8px 0;
            position:relative;
            overflow:hidden;
        }
        .label_box>label>input {
            position:absolute;
            top:0;
            left:-20px;
        }
        .label_box>label>div {
            width:60px;
            text-align:center;
            border:#dddddd solid 1px;
            height:40px;
            line-height:40px;
            color:#666666;
            user-select:none;
            overflow:hidden;
            position:relative;
        }
        .label_box>label>input:checked + div {
            border:#d51917 solid 1px;
            color:#d51917;
        }
        .label_box>label>input:checked + div:after {
            content:'';
            display:block;
            width:20px;
            height:20px;
            background-color:#d51917;
            transform:skewY(-45deg);
            position:absolute;
            bottom:-10px;
            right:0;
            z-index:1;
        }
        .label_box>label>input:checked + div:before {
            content:'';
            display:block;
            width:3px;
            height:8px;
            border-right:#ffffff solid 2px;
            border-bottom:#ffffff solid 2px;
            transform:rotate(35deg);
            position:absolute;
            bottom:2px;
            right:4px;
            z-index:2;
        }
    </style>
</head>
<body>

<div id="53988221-d134-17e3-acd1-b04be6504977" class="layui-layer-content" style="height: 821px;">
    <form style="padding:15px;" class="form-page apply-upload-add-form">
        <div class="page-form-item">
            <div class="page-form-label">可选入会计划：</div>
            <div class="page-form-input">
                <table class="page-table page-table-list">
                    <tbody><tr>
                        <th>名称</th>
                        <th>标准</th>
                        <th>份数</th>
                    </tr>
                    <c:if test="${empty insuranceInfos}">
                        <tr>
                            <td colspan="6" style="padding:30px">没有可参加的计划</td>
                        </tr>
                    </c:if>
                    <c:if test="${not empty insuranceInfos}">
                        <c:forEach items="${insuranceInfos}" var="insuranceInfo">
                            <tr class="apply-table-list" data-id="${insuranceInfo.insuranceId}">
                                <td id="insuranceName" data-id="${insuranceInfo.insuranceName}">
                                    《${insuranceInfo.insuranceName}》
                                </td>
                                <td>
                                    <div class="label_box apply-upload-add-standard">
                                        <label>
                                            <input type="radio" value="0" name="${insuranceInfo.insuranceId}">
                                            <div>不参加</div>
                                        </label>
                                        <c:forEach items="${insuranceInfo.insuranceStandardInfos}" var="insuranceStandardInfo">
                                            <label>
                                                <input type="radio" value="${insuranceStandardInfo.standardId}" data-id="${insuranceStandardInfo.price}" name="${insuranceInfo.insuranceId}">
                                                <div>￥${insuranceStandardInfo.price}</div>
                                            </label>
                                        </c:forEach>
                                    </div>
                                </td>
                                <td>
                                    <div class="label_box apply-upload-add-qty">
                                        <c:forEach items="${insuranceInfo.unitQtys}" var="unitQty">
                                            <label>
                                                <input type="radio" value="${unitQty}" name="${insuranceInfo.insuranceName}">
                                                <div>${unitQty}份</div>
                                            </label>
                                        </c:forEach>
                                    </div>
                                </td>
                            </tr>
                        </c:forEach>
                    </c:if>
                    </tbody></table>
            </div>
        </div>

        <div class="page-form-item">
            <div class="page-form-label">会员名册：</div>
            <div class="page-form-input">
                <div class="page-form-text">
                    <input type="file" name="file">
                    <a href="/hzpolicy/hzPolicyFront/downloadTemplate?tempName=${sessionScope.hzUnit.name}" target="_self" style="color:#0a3ca4">下载会员名册模板</a>
                </div>
                <div class="person-list" style="margin-top:12px;">

                </div>
            </div>
        </div>
        <div class="page page-tips" style="height:3%;">
            <p>温馨提示：花名册制作过程中不能调整花名册格式，否则将导致系统无法识别。</p>
        </div>

    </form>
</div>
<script type="text/javascript">
    $(".apply-upload-add-standard").each(function () { // 默认设置不参加
        $(this).parents("tr").find(".apply-upload-add-standard input:radio").eq(1).prop('checked', 'true');
        $(this).parents("tr").find(".apply-upload-add-qty input:radio").eq(0).prop('checked', 'true');
    });

    // $(".apply-upload-add-qty").hide(); // 初始隐藏份数选择
    $(".apply-upload-add-standard").change(function () {
        var doc = $(this).parents("tr").find(".apply-upload-add-qty");

        var res = $(this).parents("tr").find(".apply-upload-add-standard input[type='radio']:checked").val();
        if (res == "0") {
            doc.hide();
        } else {
            doc.show();
        }
    });

</script>

</body>
</html>